function ImageManager()
{
	this.loadedImages = 0;
	this.imageToBeLoad = 12;
	
	this.checkStart = function(){
		if (this.loadedImages==this.imageToBeLoad)
			return true;
		else
			return false;
	}
	
	this.healImage = new Image();
	this.healImage.src = "heal.png"
	this.healImage.onload = function(){GUI.images.loadedImages++;}
	
	this.bonusImage = new Image();
	this.bonusImage.src = "bonus.png"
	this.bonusImage.onload = function(){GUI.images.loadedImages++;}
	
	this.blockImage = new Image();
	this.blockImage.src = "blocking.png"
	this.blockImage.onload = function(){GUI.images.loadedImages++;}
	
	this.jumpImage = new Image();
	this.jumpImage.src = "jump.png"
	this.jumpImage.onload = function(){GUI.images.loadedImages++;}
	
	this.boatImage = new Image();
	this.boatImage.src = "boat.png"
	this.boatImage.onload = function(){GUI.images.loadedImages++;}
	
	this.riverBackgroundImage = new Image();
	this.riverBackgroundImage.src = "riverblank2.png"
	this.riverBackgroundImage.onload = function(){GUI.images.loadedImages++;}
	
	this.healthIcon = new Image();
	this.healthIcon.src = "healthicon.png"
	this.healthIcon.onload = function(){GUI.images.loadedImages++;}
	
	this.mainScreen = new Image();
	this.mainScreen.src = "mainscreen.png"
	this.mainScreen.onload = function(){GUI.images.loadedImages++;}
	
	this.optionsScreen = new Image();
	this.optionsScreen.src = "optionscreen.png"
	this.optionsScreen.onload = function(){GUI.images.loadedImages++;}
	
	this.howToPlayScreen = new Image();
	this.howToPlayScreen.src = "helpscreen.png"
	this.howToPlayScreen.onload = function(){GUI.images.loadedImages++;}
	
	this.creditsScreen = new Image();
	this.creditsScreen.src = "creditsscreen.png"
	this.creditsScreen.onload = function(){GUI.images.loadedImages++;}
	
	
	this.highScoreScreen = new Image();
	this.highScoreScreen.src = "scorescreen.png"
	this.highScoreScreen.onload = function(){GUI.images.loadedImages++;}
	
	
	
}

function GUIManager()
{
	
	this.images = null;
	this.images = new ImageManager();
	
	
	this.mainScreen = new Screen(this.images.mainScreen,null);
	this.mainScreen.links =[new Link(240,140,260,40,function(){GUI.setActiveScreen("gameScreen");},false),
							new Link(280,200,180,40,function(){GUI.setActiveScreen("optionsScreen");},false),
							new Link(240,270,280,40,function(){GUI.setActiveScreen("howtoplayScreen");},false),
							new Link(290,340,170,40,function(){GUI.setActiveScreen("scoreScreen");},false),
							new Link(310,400,120,40,function(){alert('You have been Exited :(')},false)
							];
	
	
	this.gameScreen = new Screen(null,
		function(){
			mygame = new Game();
			mygame.start(options);
		});
	this.optionsScreen = new Screen(this.images.optionsScreen,null);
	this.optionsScreen.links = [new Link(100,440,180,60,function(){GUI.setActiveScreen("mainScreen");},false)];
	
	this.howtoplayScreen = new Screen(this.images.howToPlayScreen,null);
	this.creditsScreen = new Screen(this.images.creditsScreen,null);
	
	this.scoreScreen = new HighScoreScreen(this.images.highScoreScreen,null);
	this.scoreScreen.links = [new Link(100,440,180,60,function(){GUI.setActiveScreen("mainScreen");},false),
								new Link(180,365,90,30,function(){GUI.scoreScreen.changePage(-1);GUI.scoreScreen.showHighScore(false);},false),
								new Link(400,365,90,30,function(){GUI.scoreScreen.changePage(1);GUI.scoreScreen.showHighScore(false);},false)];
	
	this.activeScreen = null;
	
	this.setActiveScreen = function(screenName){
		this.activeScreen = screenName;
		eval("GUI."+this.activeScreen+".show(true)");
	}
	
	this.render = function(x,y){
		if (this.activeScreen!=null)
			eval("GUI."+this.activeScreen+".render(x,y)");
	}
	this.select = function(){
		if (this.activeScreen!=null)
			eval("GUI."+this.activeScreen+".selects()");
	}
	
	canvas.onmousemove=function(e) {
		GUI.render(e.clientX-302,e.clientY-92);
	}
	
	canvas.onmousedown=function(e) {
		GUI.select();
	}
}

function Link(a,b,c,d,e,f)
{
	this.x = a;
	this.y = b;
	this.width=c;
	this.height=d;
	this.callback = e;
	this.active = f;
	this.render = function(x,y){
		
		document.getElementById("status").innerHTML = x+","+y+" - "+this.x+","+this.y+" : "+this.active;
		if (x>this.x && x<this.x+this.width && y>this.y && y<this.y+this.height)
		{
			this.active = true;
		}
		else
		{
			this.active = false;
		}
		
		this.publish();
	}
	
	this.publish = function(){
		if (this.active)
			context.strokeStyle = "rgba(200, 90, 90, 0.8)"; 
		else
			context.strokeStyle = "rgba(150, 150, 150, 0.8)";
		context.strokeRect(this.x,this.y,this.width,this.height);
	}
}

function Screen(imageloc,additionalFunction)
{
	this.additionalFunction = additionalFunction;
	if (imageloc!=null)
		this.backgroundImage = imageloc;
	this.links = [];
	this.show = function(implementFunction){
		if (this.additionalFunction!=null)
		{
			if (implementFunction)
				this.additionalFunction();
		}
		else
		{
			context.fillStyle = "rgba(90, 90, 90, 0.8)"; 
			context.fillRect (0, 0, 770, 550);	
			context.drawImage(this.backgroundImage,80,0,600,510);
		}
	}
	
	this.render = function(x,y){
		this.show(false);
		for(var i =0;i<this.links.length;i++)
		{
			this.links[i].render(x,y);
		}
	}
	
	this.selects = function(){
		for(var i =0;i<this.links.length;i++)
		{
			if (this.links[i].active)
				this.links[i].callback();
		}
	}
}

function HighScoreScreen(screen2,link)
{
	this.inheritFrom = Screen;
	this.inheritFrom(screen2,function(){GUI.scoreScreen.showHighScore();});
	this.links = link;
	this.scorePage = 0;
	this.highScoreInfo = null;
	
	this.changePage = function(openPage){
		if (openPage==1){
			this.scorePage++;
		}
		else
		{
			if (this.scorePage>0)
				this.scorePage--;
		}
	}
	
	this.getHighScoreInfo = function(){
		var xmlhttp;
		if (window.XMLHttpRequest)
			xmlhttp=new XMLHttpRequest();
		else
			xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
		xmlhttp.open("GET","highScore.asp?list=1&page="+this.scorePage,false);
		xmlhttp.send();
		var object = eval(xmlhttp.responseText)
		if (object!=null)
			return object.Records;
		return [];
	}
	
	this.showHighScore = function(){
		this.highScoreInfo = this.getHighScoreInfo();
		if (this.highScoreInfo.length==0){
			alert("There are not any high scores..")
			this.changePage(-1);
			return;
		}
		context.fillStyle = "rgba(90, 90, 90, 0.8)"; 
		context.fillRect (0, 0, 770, 550);	
		context.drawImage(this.backgroundImage,80,0,600,510);
		
		context.font = 'bold 25px Helvatica';
		context.fillStyle = "#ffff70";
		context.fillText('High Scores', 150, 150);
		context.fillStyle = "#8f7f5f";
		context.font = 'bold 20px Helvatica';
		
		for(var i = 0;i<this.highScoreInfo.length;i++)
		{
			if (i%2==0)
				context.fillStyle = "rgba(200, 190, 190, 0.8)";
			else
				context.fillStyle = "rgba(190, 200, 190, 0.8)";
			context.fillRect (152, 150+i*40, 483, 45);	
			context.fillStyle = "#2f2f3f";
			context.fillText((this.scorePage*5+i+1)+".     "+this.highScoreInfo[i].name,160, 180+i*40)
			context.fillText(this.highScoreInfo[i].score+" - "+this.highScoreInfo[i].sdate, 350, 180+i*40);
			var flag = new Image();
			flag.src = "http://iplocationtools.com/flags/"+this.highScoreInfo[i].location.toLowerCase()+".png"
			context.drawImage(flag, 178, 170+i*40)
		}
		
		context.fillStyle = "rgba(190, 190, 190, 0.8)"; 
		context.fillRect (152, 364, 483, 50);	
		context.fillStyle = "#595";
		context.fillText("Previous",185, 385);
		context.fillText("Next",405, 385);
	}
	
	this.submitHighScore = function(name,score,location){
		var xmlhttp;
		if (window.XMLHttpRequest)
			xmlhttp=new XMLHttpRequest();
		else
			xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
		xmlhttp.open("GET","highScore.asp?submit=1&name="+name+"&score="+score+"&location="+location.toLowerCase(),false);
		xmlhttp.send();
	}
	
}